এইচটিএমএল ফর্ম (HTML Form) হলো ব্যবহারকারীর কাছ থেকে তথ্য সংগ্রহ করার একটি উপায়। ফর্মের কার্যকারিতা বৃদ্ধি করতে এবং তথ্য জমা দেওয়ার প্রক্রিয়াকে নিয়ন্ত্রণ করতে বিভিন্ন এট্রিবিউট ব্যবহার করা হয়। এই এট্রিবিউটগুলো ফর্ম এবং এর ইনপুট ফিল্ডগুলোর আচরণ নির্ধারণ করে।
সাধারণ ফর্ম এট্রিবিউট
অ্যাকশন (action)
action এট্রিবিউট সার্ভারে ডেটা পাঠানোর URL নির্ধারণ করে।
<form action="/submit_form">
<input type="text" name="username">
<button type="submit">Submit</button>
</form>
উপরের উদাহরণে, ফর্ম ডেটা /submit_form URL-এ পাঠানো হবে।
মেথড (method)
method এট্রিবিউট ডেটা পাঠানোর HTTP মেথড নির্ধারণ করে। সাধারণত GET বা POST ব্যবহৃত হয়।
<form action="/submit_form" method="post">
<input type="text" name="username">
<button type="submit">Submit</button>
</form>
- GET: ডেটা URL-এ যোগ হয়।
- POST: ডেটা সার্ভারে নিরাপদে পাঠানো হয়।
এনকটাইপ (enctype)
enctype ফর্ম ডেটা কীভাবে এনকোড হবে তা নির্ধারণ করে। এটি সাধারণত ফাইল আপলোড করার সময় ব্যবহৃত হয়।
<form action="/upload" method="post" enctype="multipart/form-data">
<input type="file" name="file">
<button type="submit">Upload</button>
</form>
অতিরিক্ত ফর্ম এট্রিবিউট
অটোকমপ্লিট (autocomplete)
autocomplete ফিল্ডে আগের ডেটা পূরণ করার অনুমতি দেয়।
<form action="/submit_form" autocomplete="on">
<input type="text" name="username">
<button type="submit">Submit</button>
</form>
টার্গেট (target)
target এট্রিবিউট নির্ধারণ করে, ফর্মের আউটপুট কোন স্থানে প্রদর্শিত হবে।
- _self: একই ট্যাবে খুলবে (ডিফল্ট ভ্যালু)।
- _blank: নতুন ট্যাবে খুলবে।
<form action="/submit_form" target="_blank">
<input type="text" name="username">
<button type="submit">Submit</button>
</form>
নোভ্যালিডেট (novalidate)
novalidate এট্রিবিউট ফর্ম সাবমিশনের আগে ব্রাউজারের ডিফল্ট ভ্যালিডেশন বন্ধ করে।
<form action="/submit_form" novalidate>
<input type="email" name="email">
<button type="submit">Submit</button>
</form>
ইনপুট ফিল্ডের সাথে সম্পর্কিত এট্রিবিউট
রিকোয়ার্ড (required)
required এট্রিবিউট ইনপুট ফিল্ড বাধ্যতামূলক করে।
<form>
<input type="text" name="username" required>
<button type="submit">Submit</button>
</form>
প্লেসহোল্ডার (placeholder)
placeholder এট্রিবিউট ইনপুট ফিল্ডে প্রাথমিক নির্দেশিকা দেখায়।
<input type="text" placeholder="Enter your name">
ম্যাক্সলেংথ এবং মিনলেংথ (maxlength এবং minlength)
ইনপুটের সর্বোচ্চ ও সর্বনিম্ন অক্ষরের সংখ্যা নির্ধারণ করে।
<input type="text" maxlength="10" minlength="5">
প্যাটার্ন (pattern)
pattern এট্রিবিউট দিয়ে ইনপুটের জন্য নির্দিষ্ট রেগুলার এক্সপ্রেশন (Regular Expression) সেট করা যায়।
<input type="text" pattern="[A-Za-z]{3,}" title="Only letters, minimum 3">
এইচটিএমএল ফর্ম এট্রিবিউটগুলো ফর্মের কার্যকারিতা নিয়ন্ত্রণ করতে অত্যন্ত গুরুত্বপূর্ণ। এগুলো সঠিকভাবে ব্যবহার করলে ফর্ম আরও ব্যবহারকারী-বান্ধব এবং কার্যকর হয়ে ওঠে।
Read more
